<!-- <template> -->
  
  <!-- <el-submenu  v-if="subitem.xiajicategorylist && subitem.xiajicategorylist.length>0" :index="subitem.categoryname" :name="subitem.categoryname">
    <template #title  >
      <span style="white-space: pre-wrap;line-height:24px">{{subitem.categoryname}}</span>
      <el-icon><i class="iconfont icon-xianshidaohang"></i></el-icon>
    </template>
    <menu-tree v-for="a in subitem.xiajicategorylist" :key="a.categoryid" :subitem="a" :index="a.categoryname"/>
  </el-submenu>
 
  <el-menu-item v-else :index="subitem.categoryname" :name="subitem.categoryname">
    <span style="white-space: pre-wrap; line-height:24px">{{subitem.categoryname}}</span>
  </el-menu-item> -->

<!-- </template>  -->
<template v-for="menu in subMenu">
  <el-submenu
          v-if="menu.xiajicategorylist && menu.xiajicategorylist.length > 0"
          :key="menu.categoryid"
  >
    <template slot="title">
      {{ menu.categoryname }}
    </template>
    <!-- 调用自身-->
    <my-sub-menu :subMenu="menu.xiajicategorylist"></my-sub-menu>
  </el-submenu>
  <!-- 如果没有子菜单，则显示当前内容 -->
  <el-menu-item v-else :key="menu.categoryid">
    {{ menu.categoryname }}
  </el-menu-item>
</template>
<script setup>
  export default {
    name: 'MySubMenu',
    props: {
      subMenu: {
        type: Array,
        required: true
      },

    },
    watch: {
    },
    created() {
    },
    methods: {
    }

    

  }

</script>
  
<style scoped></style>
